<template>
  <div class="city">
    <CityHeader></CityHeader>
    <CityHot :hotCities="hotCities"  :cities="cities"></CityHot>
  </div>
</template>
<script>
  import CityHeader from './pages/Header.vue'
  import CityHot from  './pages/Hot.vue'
  export default{
    data(){
      return{
        hotCities:[],
        cities:[],
        index:""
      }
    },
    methods:{
      find(index){
        this.index = index;
      }
    },
    components:{
      CityHeader,
      CityHot,
    },
    mounted(){
      this.$http.get("/api/data/city.json").then((res)=>{
        this.hotCities = res.data.data.hotCities;
        this.cities = res.data.data.cities;
        // console.log(res.data.data.cities)
      })
    }
  }
</script>
<style scoped>
  .city{
    background: #f5f5f5;
  }
</style>
